<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"  
    xmlns:h="http://java.sun.com/jsf/html"  
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    template="/plantillas/plantilla-sistema.xhtml">
    <ui:define name="cabecera">
        <title>Gestión de Clasificación</title>
        <link rel="shortcut icon"  href="../../resources/imagenes/favicon.ico" />
    </ui:define>
    <ui:define name="contenido">
      <center>
            <p:panel header="Animales" style="width: 950px" >
               <h:form id="tablaAnimalFrm"> 
                   <p:dataTable id="tablaAnimal" var="animal"
                                value="#{animalBean.listaAnimals}" emptyMessage="No hay registros disponibles."
                                resizableColumns="true" paginator="true" paginatorPosition="bottom" rows="10" 
                                rowKey="#{animal.codigoanimal}">
                       
                            <p:column filterBy="#{animal.especie.nombre}" sortBy="#{animal.especie.nombre}"   
                                headerText="Especie" filterMatchMode="contains">
                                <h:outputText id="especieTxt" value="#{animal.especie.nombre}"  />
                            </p:column>
                            <p:column filterBy="#{animal.nombrecientifico}"  sortBy="#{animal.nombrecientifico}"  
                                headerText="Nombre Cientifico" filterMatchMode="contains">
                                <h:outputText id="nombrecientificoTxt" value="#{animal.nombrecientifico}" />
                            </p:column>
                            <p:column filterBy="#{animal.nombrecomun}" sortBy="##{animal.nombrecomun}"  
                                headerText="Nombre Común" filterMatchMode="contains">
                                <h:outputText id="nombrecomunTxt" value="#{animal.nombrecomun}"   />
                            </p:column>
                            <p:column filterBy="#{animal.rangodistribucion}" sortBy="#{animal.rangodistribucion}"   
                                headerText="Rango Distribución" filterMatchMode="contains">
                                <h:outputText id="rangodistribucionTxt" value="#{animal.rangodistribucion}"  />
                            </p:column>
                            <p:column filterBy="#{animal.referenciasbibliograficas}"  sortBy="#{animal.referenciasbibliograficas}"  
                                headerText="Referencia Bibliografica" filterMatchMode="contains">
                                <h:outputText id="referenciabibliograficaTxt" value="#{animal.referenciasbibliograficas}" />
                            </p:column>
                            <p:column headerText="Sinonimia" >
                                 <p:commandButton id="sinonimiaBtn"  value="Sinonimia" type="button" />  
                                 <p:overlayPanel id="carPanel" for="sinonimiaBtn" appendToBody="true" showEvent="mouseup"
                                                 hideEvent="mouseup" hideEffect="fade" dynamic="true">  
                                     <p:dataTable id="table" var="sinonimia"  value="#{animalBean.getSinonimias(animal)}" 
                                                  rowKey="" rows="10" paginator="true">  
                                        <p:column headerText="Animal">  
                                            <h:outputText value="#{sinonimia.animal.codigoanimal}" />  
                                        </p:column>  
  
                                        <p:column headerText="Nombre Antiguo">  
                                            <h:outputText value="#{sinonimia.nombreantiguo}" />  
                                        </p:column>  
                                      </p:dataTable>  
                                  </p:overlayPanel>
                                 
                                 
                                 
                            </p:column>
                            <p:column headerText="Modificar" > 
                                <center>
                                    <p:commandButton id="modificarBtn" title="Modificar" icon="ui-icon-pencil"
                                                 actionListener="#{animalBean.prepararModificacion(animal)}" 
                                                 update=":guardarAnimalFrm:guardarAnimalPnl" 
                                                oncomplete="guardarAnimalWgt.show()" />
                                </center>
                            </p:column>
                            <p:column  headerText="Eliminar" >
                                <center>
                                    <p:commandButton id="eliminarBtn" title="Eliminar" icon="ui-icon-trash"
                                                 actionListener="#{animalBean.prepararEliminacion(animal)}" 
                                                 update=":eliminarAnimalFrm:eliminarAnimalPnl"
                                                 oncomplete="eliminarAnimalWgt.show()"/>
                                </center>
                            </p:column>
                       </p:dataTable>
                        <p:commandButton id="nuevoBtn" value="Nuevo Animal"
                                                actionListener="#{animalBean.prepararAdicion}" 
                                                update=":guardarAnimalFrm:guardarAnimalPnl" 
                                                oncomplete="guardarAnimalWgt.show()" 
                                                icon="ui-icon-document"/>
                    </h:form>
                </p:panel>
          
     </center>
        
    </ui:define>  
    <ui:define name="extra">
        <p:dialog id="guardarAnimalDlg" header="Nuevo Animal" widgetVar="guardarAnimalWgt" 
                    resizable="false" modal="true" showEffect="false" width="850">
            <h:form id="guardarAnimalFrm">
                <h:panelGrid id="guardarAnimalPnl" columns="4" style="margin-bottom:10px">
                    
                    <p:outputLabel for="codigoespecieTxt" value="Especie:" />
                    <p:selectOneMenu id="codigoespecieTxt" value="#{animalBean.animal.especie}" required="true">
                        <f:selectItem itemLabel="Seleccione..." itemValue="" />
                        <f:selectItems value="#{animalBean.itemsEspecie}" />
                        <f:converter converterId="especieConverter" />
                    </p:selectOneMenu>
                                      
                    <p:outputLabel for="nombrecientificoTxt" value="Nombre Cientifico:" />
                    <p:inputText id="nombrecientificoTxt" value="#{animalBean.animal.nombrecientifico}"/> 
                    
                    <p:outputLabel for="nombrecomunTxt" value="Nombre Comun:" />
                    <p:inputText id="nombrecomunTxt" value="#{animalBean.animal.nombrecomun}"/> 
                              
                    <p:outputLabel for="rangoDistribucionTxt" value="Rango Distribucion:" />
                    <p:inputText id="rangoDistribucionTxt" value="#{animalBean.animal.rangodistribucion}"/> 
                    
                    <p:outputLabel for="referenciaBibliograficaTxt" value="Referencia Bibliografica:" />
                    <p:inputText id="referenciaBibliograficaTxt" value="#{animalBean.animal.referenciasbibliograficas}"/> 
                                                          
                    <p:commandButton id="guardarBtn" actionListener="#{animalBean.agregarAnimal}" 
                                     oncomplete=":guardarAnimalWgt.hide()" update=":tablaAnimalFrm:tablaAnimal" 
                                     title="Guardar" value="Guardar"/>
                    <p:commandButton id="cancelarBtn"  type="button" onclick="guardarAnimalWgt.hide()" 
                                     value="Cancelar" title="Cancelar"/>
                    
                </h:panelGrid>
                   
            </h:form>
        </p:dialog>
        <p:dialog id="modificarAnimalDlg" header="Modificar Animal" widgetVar="modificarAnimalWgt" 
                    resizable="false" modal="true" showEffect="false" width="850">
            <h:form id="modificarAnimalFrm">
                <h:panelGrid id="modificarAnimalPnl" columns="4" style="margin-bottom:10px">
                    
                    <p:outputLabel for="codigoespecieTxt" value="Especie:" />
                    <p:selectOneMenu id="codigoespecieTxt" value="#{animalBean.animal.especie}" required="true">
                        <f:selectItem itemLabel="Seleccione..." itemValue="" />
                        <f:selectItems value="#{animalBean.itemsEspecie}" />
                        <f:converter converterId="especieConverter" />
                    </p:selectOneMenu>
                                      
                    <p:outputLabel for="nombrecientificoTxt" value="Nombre Cientifico:" />
                    <p:inputText id="nombrecientificoTxt" value="#{animalBean.animal.nombrecientifico}"/> 
                    
                    <p:outputLabel for="nombrecomunTxt" value="Nombre Comun:" />
                    <p:inputText id="nombrecomunTxt" value="#{animalBean.animal.nombrecomun}"/> 
                              
                    <p:outputLabel for="rangoDistribucionTxt" value="Rango Distribucion:" />
                    <p:inputText id="rangoDistribucionTxt" value="#{animalBean.animal.rangodistribucion}"/> 
                    
                    <p:outputLabel for="referenciaBibliograficaTxt" value="Referencia Bibliografica:" />
                    <p:inputText id="referenciaBibliograficaTxt" value="#{animalBean.animal.referenciasbibliograficas}"/> 
                                                          
                    <p:commandButton id="guardarBtn" actionListener="#{animalBean.actualizarAnimal}"
                                     oncomplete=":modificarAnimalWgt.hide()" update=":tablaAnimalFrm:tablaAnimal"
                                     value="Guardar" title="Guardar"/>
                    <p:commandButton id="cancelarBtn" type="button" onclick="modificarRecolectorWgt.hide()"
                                     value="Cancelar" title="Cancelar"/>
                    
                </h:panelGrid>
                   
            </h:form>
        </p:dialog>

        <p:dialog id="eliminarAnimalDlg" header="Eliminar Animal" widgetVar="eliminarAnimalWgt" 
                  resizable="false" modal="true" showEffect="false">
            <h:form id="eliminarAnimalFrm">
                <h:panelGrid id="eliminarAnimalPnl" style="margin-bottom:10px">
                    <p:row >
                        <p:column colspan="2">
                            <h:outputText value="¿Está seguro de eliminar este animal?"/>
                        </p:column>
                    </p:row>
                    <p:row>
                        <p:column>
                            <p:commandButton id="confirmarBtn" value="Confirmar" icon="ui-icon-check"
                                            actionListener="#{animalBean.eliminarAnimal}" 
                                            oncomplete=":eliminarAnimalWgt.hide()" 
                                            update=":tablaAnimalFrm:tablaAnimal" 
                                            title="Confirmar"/>
                        </p:column>
                        <p:column>
                            <p:commandButton value="Cancelar" type="button" 
                                             onclick="eliminarAnimalWgt.hide()"
                                             icon="ui-icon-cancel" title="Cancelar">
                                <p:spacer width="20" height="30" />
                            </p:commandButton>
                        </p:column>
                    </p:row>
                </h:panelGrid>
            </h:form>
        </p:dialog>

    </ui:define>
    
</ui:composition>
